<template>
	<view class="num">
		<view class="box">
		<view class="box1">
		<text>姓名：</text>	<input type="text" v-model="name" placeholder="请输入姓名" style="margin-left: 30px;">
		</view>
		<view class="box1">
		<text>联系电话：</text>	<input type="text" v-model="phone" placeholder="请输入电话号码">
		</view>
		 <view class="box1">
		       <text>所在地区：</text><input type="text" v-model="address" placeholder="请填写地址">		       
		    </view>
			<view class="box1">
			<text>详细地址：</text>	<input type="text" v-model="specific" placeholder="请填写具体地址">
			</view>			
		</view>	
		<view class="userl">
			 <u-radio-group
			    v-model="radiovalue1"
			    placement="column"
			    @change="groupChange"
			  >
			    <u-radio
			      :customStyle="{marginBottom: '8px'}"
			      v-for="(item, index) in radiolist1"
			      :key="index"
			      :label="item.name"
			      :name="item.name"
			      @change="radioChange"
				  style="margin-left: 10vw;margin-top: 1vh;"
			    >
			    </u-radio>
			  </u-radio-group>
		</view>	
		<button @click="sunp" class="but">立即保存</button>
	</view>

</template>

<script>
	export default{
		data(){
			return{
				name:'',
				phone:'',
				address:'',
				specific:'',
			          radiolist1: [{
			            name: '设置默认地址',
			            disabled: false
			          },
			            
			          ],
			          // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
			          radiovalue1: '',
			}
		},
		methods: {
		      groupChange(n) {
		        console.log('groupChange', n);
		      },
		      radioChange(n) {
		        console.log('radioChange', n);
		      },
			  
			}
	}
</script>

<style lang="scss">		
	.num{
		width: 100vw;
		height: 100vh;
		background-color: #f5f5f5;
	}
	.box{		
		width: 81vw;
		height: 19vh;
		background-color:#fff;
		margin-left: 10vw;
		
	}		
	.box1{
		width: 80vw;
		display: flex;
		border-bottom:1px solid #ccc ;
		margin-left: 5px;
		padding: 10px 0 ;
		border-radius: 10px;
	}
	.userl{
		margin-top: 2vh;
		margin-left: 10vw;
		width: 80vw;
		height: 4vh;
		background-color: #fff;
		border-radius: 10px;
	}
	.but{
		width: 80vw;
		background-color: red;
		color: #fff;
		margin-top: 5vh;
		border-radius: 20px;
	}
</style>